.roboto-thin {
    font-family: "Roboto", serif;
    font-weight: 100;
    font-style: normal;
  }

  .roboto-light {
    font-family: "Roboto", serif;
    font-weight: 300;
    font-style: normal;
  }

  .roboto-regular {
    font-family: "Roboto", serif;
    font-weight: 400;
    font-style: normal;
  }

  .roboto-medium {
    font-family: "Roboto", serif;
    font-weight: 500;
    font-style: normal;
  }

  .roboto-bold {
    font-family: "Roboto", serif;
    font-weight: 700;
    font-style: normal;
  }

  .roboto-black {
    font-family: "Roboto", serif;
    font-weight: 900;
    font-style: normal;
  }

  .roboto-thin-italic {
    font-family: "Roboto", serif;
    font-weight: 100;
    font-style: italic;
  }

  .roboto-light-italic {
    font-family: "Roboto", serif;
    font-weight: 300;
    font-style: italic;
  }

  .roboto-regular-italic {
    font-family: "Roboto", serif;
    font-weight: 400;
    font-style: italic;
  }

  .roboto-medium-italic {
    font-family: "Roboto", serif;
    font-weight: 500;
    font-style: italic;
  }

  .roboto-bold-italic {
    font-family: "Roboto", serif;
    font-weight: 700;
    font-style: italic;
  }

  .roboto-black-italic {
    font-family: "Roboto", serif;
    font-weight: 900;
    font-style: italic;
  }

  .open-sans {
  font-family: "Open Sans", serif;
  font-optical-sizing: auto;
  font-weight: weight;
  font-style: normal;
  width: 100;
}



body {
    background-color: greenyellow;
    overflow: hidden;
    font-family: "Roboto";

}

#blackLine {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4%;
    background-color: black;
    z-index:2;
    cursor:pointer;
}

#blackLineMenu {
    position: absolute;
    top: -80%;
    left: 0;
    width: 100%;
    height: 38%;
    transition: 1s;
    background-color: white;
    z-index:3;
}

#menu {
    position: absolute;
    top: 4%;
    left: 0;
    width: 100%;
    height: 8%;
    background-color: white;
    font-size: 1em;
    z-index:2;
}


#menu2 {
    text-align: center;
    display: flex;
    justify-content: center;
    list-style: none;
    padding-inline-start: 0px;
    margin-block-start: 0px;
    margin-block-end: 0px;
}


.btnMenu {
    align-self: center;
    color: black;
    cursor: pointer;
    margin-left: 2em;
    margin-top: 1.8em;
}

.btnMenu:nth-child(1) {
    margin-left: 0px;
  }


#bacikBody1 {
    position:absolute;
    bottom: -100%;
    left: 0;
    width: 100%;
    height: 100%;
    transition: 1s;
    backdrop-filter: blur(8px);
}

#movMenu1 {
    position: absolute;
    top: -35%;
    left: 0;
    width: 100%;
    height: 35%;
    background-color: white;
    transition: 1s;
    border-top:solid 0.1em;
    border-color: rgb(230, 224, 224);
    z-index:1;
}

#movMenu2 {
  position: absolute;
  top: -40%;
  left: 0;
  width: 100%;
  height: 30%;
  background-color: white;
  transition: 1s;
  border-top:solid 0.1em;
  border-color: rgb(230, 224, 224);
  z-index:1;
}


#movMenu3 {
  position: absolute;
  top: -30%;
  left: 0;
  width: 100%;
  height: 30%;
  background-color: white;
  transition: 1s;
  border-top:solid 0.1em;
  border-color: rgb(230, 224, 224);
  z-index:1;
}


#movMenu4 {
  position: absolute;
  top: -100%;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: white;
  transition: 1s;
  border-top:solid 0.1em;
  border-color: rgb(230, 224, 224);
  z-index:1;
}

#movMenu5 {
  position: absolute;
  top: -60%;
  left: 0;
  width: 100%;
  height: 40%;
  background-color: white;
  transition: 1s;
  border-top:solid 0.1em;
  border-color: rgb(230, 224, 224);
  z-index:1;
}

#numberOfDays {
  text-align: center;
margin-top: 2em;
}

#choosingAcountry {
  text-align: center;
  margin-top: 2.6em;
}


#routeLocation {
  text-align: center;
  margin-top: 2.6em;
}

#filterByPrice {
  text-align: center;
margin-top: 2em;
}


#bySeasonality {
  text-align: center;
  margin-top: 2.6em;
}

#byTargetAudience {
  text-align: center;
  margin-top: 2.6em;
}


#tourThemeArrUl1 {
  text-align: center;
  display: flex;
  justify-content: center;
  list-style: none;
  padding-inline-start: 0px;
  margin-block-start: 0px;
  margin-block-end: 0px;
}

.tourTheme1 {
  align-self: center;
  cursor: pointer;
  margin-left: 3.2em;
  margin-top: 1.8em;
}

.tourTheme1:nth-child(1) {
  margin-left: 0px;
}

#tourThemeArrUl2 {
  text-align: center;
  display: flex;
  justify-content: center;
  list-style: none;
  padding-inline-start: 0px;
  margin-block-start: 0px;
  margin-block-end: 0px;
}

.tourTheme2 {
  align-self: center;
  cursor: pointer;
  margin-left: 4.5em;
  margin-top: 1.8em;
}

.tourTheme2:nth-child(1) {
  margin-left: 0px;
}


#tourThemeArrUl3 {
  text-align: center;
  display: flex;
  justify-content: center;
  list-style: none;
  padding-inline-start: 0px;
  margin-block-start: 0px;
  margin-block-end: 0px;
}

.tourTheme3 {
  align-self: center;
  cursor: pointer;
  margin-left: 2.4em;
  margin-top: 1.8em;
}

.tourTheme3:nth-child(1) {
  margin-left: 0px;
}


#tourThemeArrUl4 {
  text-align: center;
  display: flex;
  justify-content: center;
  list-style: none;
  padding-inline-start: 0px;
  margin-block-start: 0px;
  margin-block-end: 0px;
}

.tourTheme4 {
  align-self: center;
  cursor: pointer;
  margin-left: 3.6em;
  margin-top: 1.8em;
}

.tourTheme4:nth-child(1) {
  margin-left: 0px;
}


#btnMenu1 {
  border-bottom: 0.1em solid white;
  padding-bottom: 0.25em;
  margin-top: 2.1em;
}

#btnMenu2 {
  border-bottom: 0.1em solid white;
  padding-bottom: 0.25em;
  margin-top: 2.1em;
}

#btnMenu3 {
  border-bottom: 0.1em solid white;
  padding-bottom: 0.25em;
  margin-top: 2.1em;
}

#btnMenu4 {
  border-bottom: 0.1em solid white;
  padding-bottom: 0.25em;
  margin-top: 2.1em;
}

#btnMenu5 {
  border-bottom: 0.1em solid white;
  padding-bottom: 0.25em;
  margin-top: 2.1em;
}


#passwordEay1 {
  z-index: 3;
  margin-top: -1.5em;
  margin-left: 23em;
  opacity: 1;
  cursor: pointer;
}

#passwordEay2 {
  z-index: 3;
  margin-top: -1.5em;
  margin-left: 23em;
  opacity: 1;
  cursor: pointer;
}

#passwordEayConfig {
  z-index: 3;
  margin-top: -1.5em;
  margin-left: 23em;
  opacity: 1;
  cursor: pointer;
}

#passwordEay1BL {
  z-index: 3;
  margin-top: -1.5em;
  margin-left: 23em;
  opacity: 1;
  cursor: pointer;
}

#passwordEay2BL {
  z-index: 3;
  margin-top: -1.5em;
  margin-left: 23em;
  opacity: 1;
  cursor: pointer;
}

#passwordEayConfigBL {
  z-index: 3;
  margin-top: -1.5em;
  margin-left: 23em;
  opacity: 1;
  cursor: pointer;
}

#passwordEay2M {
  z-index: 3;
  margin-top: -1.5em;
  margin-left: 23em;
  opacity: 1;
  cursor: pointer;
}

#passwordEay1M {
  z-index: 3;
  margin-top: -1.5em;
  margin-left: 23em;
  opacity: 1;
  cursor: pointer;
}

#passwordEayConfigM {
  z-index: 3;
  margin-top: -1.5em;
  margin-left: 23em;
  opacity: 1;
  cursor: pointer;
}

#passwordEay2M2 {
  z-index: 3;
  margin-top: -1.5em;
  margin-left: 23em;
  opacity: 1;
  cursor: pointer;
}

#passwordEay1M2 {
  z-index: 3;
  margin-top: -1.5em;
  margin-left: 23em;
  opacity: 1;
  cursor: pointer;
}

#passwordEayConfigM2 {
  z-index: 3;
  margin-top: -1.5em;
  margin-left: 23em;
  opacity: 1;
  cursor: pointer;
}

#bagroundAlert {
  position: absolute;
  top: 0%;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  z-index: 100000000;
  text-align: center;
  display: none;
}

#modal-box {
  display: inline-block;
  background-color: white;
  width: 20em;
  height: 8em;
  border-radius: 12px;
  margin-top: 20em;
  text-align: center;
}

#btnCloseAlert {
  display: inline-block;
  margin-top: 2em;
  font-size: 1em;
  color: rgb(65, 105, 225);
  text-align: center;
  cursor: pointer;
}

#chooseRoles {
  text-align: center;
  display: flex;
  justify-content: center;
  list-style: none;
  padding-inline-start: 0px;
  margin-block-start: 0px;
  margin-block-end: 0px;
}

.chooseRole {
  align-self: center;
  cursor: pointer;
  margin-left: 2em;
  margin-top: 1em;
}

.chooseRole:nth-child(1) {
  margin-left: 0px;
}